<!--
 * Description: RFQ check状态改变
 * Company: 联宝（合肥）电子科技有限公司
 * Author: Chengming.Li
 * Date: 2020/11/26 11:19
-->
<template>
  <div v-loading="isRequesting">
    <el-row class="select-wrap">
      <el-radio-group v-model="formData.checkState">
        <el-radio border class="pass" :label="1">{{ $t('button.pass') }}</el-radio>
        <el-radio border class="noPass" :label="0">{{ $t('button.reject') }}</el-radio>
      </el-radio-group>
    </el-row>

    <span style="display: block;text-align: center;">
      <!--取消按钮-->
      <el-button size="medium" @click="cancel">{{ $t('button.cancel') }}</el-button>
      <!--保存按钮-->
      <el-button size="medium" type="primary" @click="save">{{ $t('button.save') }}</el-button>
    </span>
  </div>
</template>

<script>
import { changeCheckState } from '@/api/rfq/rfq'
export default {
  name: 'RfqCheckDialog',
  components: {},
  props: {
    rowData: {
      required: true
    }
  },
  data() {
    return {
      /** 表单数据 */
      formData: {},
      /** 正在查询 */
      isRequesting: false
    }
  },
  computed: {},
  watch: {},
  created() {
    this.formData = this.$deepCopy(this.rowData)
  },
  mounted() {},
  methods: {
    // 保存
    async save() {
      if (this.formData.checkState !== '') {
        try {
          this.isRequesting = true
          await changeCheckState(
            {
              rfqId: this.formData.rfqId,
              version: this.formData.version,
              state: '20',
              checkState: this.formData.checkState
            },
            { msgSuccess: true, msgError: true }
          )
          this.$emit('update:State')
          this.cancel()
        } catch (error) {
          console.log(error)
        } finally {
          this.isRequesting = false
        }
      } else {
        this.cancel()
      }
    },
    // 取消
    cancel() {
      this.$emit('cancel')
    }
  }
}
</script>

<style lang="scss" scoped>
.select-wrap {
  text-align: center;
  margin-bottom: 20px;
}

/deep/.pass.el-radio.is-bordered.is-checked {
  border-color: green !important;
  .el-radio__inner {
    border-color: green !important;
    background: green !important;
  }
}
.pass /deep/.el-radio__input.is-checked + .el-radio__label {
  color: green !important;
}
/deep/.noPass.el-radio.is-bordered.is-checked {
  border-color: red !important;
  .el-radio__inner {
    border-color: red !important;
    background: red !important;
  }
}
.noPass /deep/.el-radio__input.is-checked + .el-radio__label {
  color: red !important;
}
</style>
